<template>
	<view id="funds-detail">
		<view class="page-header">
			<view class="title">{{fundsForm.moneyType == 1 ? '积分':'奖励积分'}}({{merchantMoneyText}})</view>
			<!--<view class="content">-->
			<!--	<view class="money">{{money}}</view>-->
			<!--	<button class="withdraw-btn" @click="toWithdrawPage">提现</button>-->
			<!--</view>-->
		</view>
		<view class="page-content">
			<view class="funds-detail-list" v-for="(item,index) in fundsList" :key="index">
				<view class="funds-list" >
					<view>
						<view class="funds-title">{{item.finance_type_name}}【本、佣】</view>
						<view class="funds-time">{{item.create_time}}</view>
					</view>
					<view>
						<view class="funds-change-money" >{{item.capital_change + '、' + item.commission_change }}</view>
						<view class="funds-money">余：{{item.capital_balance }} 、{{item.commission_balance}}</view>
					</view>
				</view>
                <view class="remark" v-if="(item.remark && item.remark !='管理员审核') || item.shop_name">
                    注：{{ item.shop_name }} {{item.remark =='管理员审核' ? '' : item.remark}}
                </view>
			</view>
			<view class="no-data-tips" v-if="fundsList.length == 0">
				<image class="no-data-img" src="../../static/img/no-data-img.png" mode=""></image>
				<view>暂无数据</view>
			</view>
			<uni-load-more v-if="allNum > 10" :status="loadingType"></uni-load-more>
		</view>
	</view>
</template>

<script>
	import uniLoadMore from '../../components/uni-load-more/uni-load-more.vue';
	import {apiGetPushCapitalFlowList,apiCommissionCapitalCash} from '../../../http/apis.js'
	import {
		mapState
	} from 'vuex'
	export default {
		components: {
			uniLoadMore
		},
		computed: {
			...mapState(['token'])
		},
		data(){
			return {
				fundsForm: {
					token: '',
					page: 1,
					pageSize: 10,
					moneyType: 1
				},
				fundsList: [],
				money: '',
				loadingType: 'more',
				allNum: 0,
				merchantMoneyText: uni.getStorageSync('merchantMoneyText')
			}
		},
		onShow() {


		},
		onLoad(options) {
			this.fundsForm.moneyType = options.type
			this.fundsForm.token = this.token
			apiCommissionCapitalCash({
				token: this.token,
				type: this.fundsForm.moneyType
			}).then(res =>{
			    if(res.data.code == 1)  {
					this.money = res.data.msg.money
				}
			}).catch(res => {
				this.$msg.showToast(res.data.msg)
			})
			this.getCapitalFlow()
		},
		onReachBottom(){
			// 上拉加载
			setTimeout(()=>{
				this.loadMoreData()
			},1000)
		},
		methods:{
			getCapitalFlow(){
				uni.showLoading({
					title: '加载中'
				});
				apiGetPushCapitalFlowList(this.fundsForm).then(res =>{
					uni.hideLoading()
				    if(res.data.code == 1)  {
						this.fundsList = res.data.msg.res
						this.allNum = res.data.msg.con
					}
				}).catch(res => {
					uni.hideLoading()
					this.$msg.showToast(res.data.msg)
				})
			},
			toWithdrawPage(){
				uni.navigateTo({
					url: './withdraw?type=' + this.fundsForm.moneyType
				})
			},
			async loadMoreData(){
				this.fundsForm.page++;
				if (this.loadingType!= 'more') {
					//loadingType!=0;直接返回
					return false;
				}
				this.loadingType = 'loading';
				apiGetPushCapitalFlowList(this.fundsForm).then(res =>{
				    if(res.data.code == 1)  {
						let data = res.data.msg.res
						if (data == null || data.length == 0) {
							//没有数据
							this.loadingType = 'nomore';
							return false;
						}
						for (var i in data) {
							this.fundsList.push(data[i]);
						}
						this.loadingType = 'more';
					}
				}).catch(res => {
					this.$msg.showToast(res.data.msg)
				})


			}
		}
	}
</script>

<style lang="scss">
	#funds-detail {
		.page-header {
			background: #fff;
			border-bottom: 32upx solid #F7F7F7;
			padding: 32upx;
			.title {
				font-size: 28upx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #333333;
				line-height: 40upx;
				margin-top: 20upx;
			}

			.content {
				display: flex;
				justify-content: space-between;
				align-items: center;
				.money {
					font-size: 60upx;
					font-family: PingFang-SC-Bold, PingFang-SC;
					font-weight: bold;
					color: #333333;
					line-height: 92upx;
					flex: 1;
				}

				.withdraw-btn {
					width: 240upx;
					height: 92upx;
					background: #FF5001;
					border-radius: 4upx;
					font-size: 32upx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #FFFFFF;
					line-height: 92upx;
				}
			}
		}
		.page-content {
			.nodata-tips {
				text-align: center;
				font-size: $font-lg;
				padding-top: 100upx;
			}
			.funds-detail-list {
				border-bottom: $border-bottom-base;
			}
			.remark {
				padding: 0 32upx 20upx 32upx;
				font-size: 28upx;
				font-weight: 400;
				color: $theme-color;
				line-height: 28upx;
				font-family: PingFangSC-Regular, PingFang SC;
			}
			.funds-list {
				padding: 32upx;
				background: #ffffff;
				display: flex;
				justify-content: space-between;
				// border-bottom: 1px solid #E0E0E0;
				font-family: PingFangSC-Regular, PingFang SC;

				.funds-title {
					font-size: 32upx;
					font-weight: 400;
					color: #333333;
					line-height: 32upx;
				}

				.funds-change-money {
					text-align: right;
					color: $theme-color;
					font-size: 32upx;
					font-weight: 500;
					line-height: 32upx;

				}

				.funds-time {
					margin-top: 20upx;
					font-size: 28upx;
					font-weight: 400;
					color: #999999;
					line-height: 28upx;
				}

				.funds-money {
					margin-top: 20upx;
					font-size: 28upx;
					font-weight: 400;
					color: #999999;
					line-height: 28upx;
				}
			}
		}
		.no-data-tips {
			text-align: center;
			font-size: 28upx;
			font-weight: 400;
			color: #999999;
			margin-top: 160upx;
			line-height: 28upx;
			.no-data-img {
				width: 300upx;
				height: 300upx;
				margin-top: 30upx;
				margin-bottom: 20upx;
			}
		}
	}
</style>
